import React from "react";
import { Tabs } from "antd";
import { AppstoreOutlined, BarsOutlined } from "@ant-design/icons";
import { ComponentLib } from "./ComponentLib";
import Layer from "./Layer";
import panelStyles from "./Panel.module.scss";

const LeftPanel: React.FC = () => {
  const tabsItems = [
    {
      key: "componentLib",
      label: (
        <span>
          <AppstoreOutlined />
          组件库
        </span>
      ),
      children: <ComponentLib />,
    },
    {
      key: "layers",
      label: (
        <span>
          <BarsOutlined />
          图层
        </span>
      ),
      children: <Layer />,
    },
  ];

  return (
    <Tabs
      defaultActiveKey="componentLib"
      items={tabsItems}
      className={panelStyles.tabs}
    />
  );
};

export default LeftPanel;
